<template>
     <div class="wrap">
        <headline :title="'人员管理'"></headline>
        <div class="content">
            <el-row class="numBox">
                <el-col :span="12">
                    <div class="IconBox">
                        <img class="userIcon" src="/images/userIcon.png" alt="">
                    </div>
                    <div class="numWrap">
                        <p class="num">52</p>
                        <p>今日访客</p>
                    </div>
                </el-col>
                <el-col :span="12">
                    <div class="IconBox">
                        <img class="userIcon" src="/images/userIcon.png" alt="">
                    </div>
                    <div class="numWrap">
                        <p class="num">637</p>
                        <p>本周访客</p>
                    </div>
                </el-col>
            </el-row>
            <el-row class="numBox">
               <el-col :span="12">
                   <div class="IconBox">
                       <img class="userIcon" src="/images/userIcon.png" alt="">
                   </div>
                   <div class="numWrap">
                       <p class="num">1375</p>
                       <p>在校学生</p>
                   </div>
               </el-col>
               <el-col :span="12">
                   <div class="IconBox">
                       <img class="userIcon" src="/images/userIcon.png" alt="">
                   </div>
                   <div class="numWrap">
                       <p class="num">345</p>
                       <p>在校老师</p>
                   </div>
               </el-col>
           </el-row>
            <!-- <visitor_chart class="echart"></visitor_chart> -->
        </div>
    </div>
</template>
<script setup>
import headline from '../template/headline.vue';
import visitor_chart from './visitor_chart.vue';
import { ref , onMounted } from 'vue'


</script>

<style scoped lang="less">
    
    .wrap{
        overflow: hidden;
        .content
        {
            .numBox{
                color: white;
                margin: 20px;
                .IconBox{
                    width: 50px;
                    height: 60px;
                    line-height: 60px;
                    float: left;
                    .userIcon{
                        width: 100%;
                        height: auto;
                    }
                }
                p{
                    text-align: left;
                    
                }
                .numWrap{
                    padding-left:55px;
                    .num{
                    
                    }
                }
            }
            
        }

        .echart{
            margin-top:-40px;
            margin-left: 10px;
            width: 320px;
            height: 200px;
            overflow: hidden;
        }
    }


</style>